<template>
  <div class="bigbox">
    <div class="top">
      <div class="zuo" @click="$router.replace('/fen')">
        <p>
          <van-icon name="arrow-left" />
        </p>
      </div>
      <div class="zhong">
        <h2>分类</h2>
      </div>
      <div class="you" @click="$router.push({ path: '/search'})">
        <span>
          <van-icon name="search" />
        </span>
      </div>
    </div>
    <div class="center">
      <div class="cenleft">
        <NavLeft></NavLeft>
      </div>
      <div class="cenright"></div>
    </div>
  </div>
</template>

<script>
import NavLeft from "@/components/NavLeft.vue";
export default {
  components: {
    NavLeft,
  },
  props: ["item"],

  
};
</script>

<style lang="scss" scoped>
a {
  list-style: none;
  text-decoration: none;
  color: #aaa;
}
a.router-link-exact-active {
  color: #fbaf02;
  border-bottom: 3rem solid #fbaf02;
}
.select::before{
  color: #fbaf02;
}
.top {
  position: fixed;
  top: 0;
  width: 100vw;
  height: 46rem;
  line-height: 6vh;
  background-color: #f5f5f5;
  display: flex;
  justify-content: space-between;
  z-index: 333;
  .zuo {
    font-size: 24rem;
    color: #656565;
    line-height: 55rem;
  }
  .zhong {
    width: 50rem;
    text-align: center;
    line-height: 46rem;
    .luyou {
      display: flex;
      justify-content: space-between;
    }
  }
  .you {
    font-size: 25rem;
    line-height: 47rem;
    i {
      color: #656565;
    }
  }
}
.center{
  margin-top: 8vh;
}
</style>
